<script setup>
import {ref} from 'vue'
import {useRoute, useRouter} from "vue-router";

let search_key = ref('')

const route = useRoute()
const router = useRouter()

const searchButtonClick = () => {
  if (route.path === '/search' && search_key.value) {
    router.push(`/search/${search_key.value}`)
  }
}
</script>

<template>
  <div class="header">
    <i> - </i>
    <input v-model="search_key" type="text">
    <van-button @click="searchButtonClick" type="primary">搜索</van-button>
  </div>
</template>

<style scoped lang="scss">
.header {
  display: flex;
  align-items: center;
}
</style>